Micron Document
<!DOCTYPE html>
<html class="client-nojs vector-feature-night-mode-disabled vector-feature-language-in-header-enabled vector-feature-language-in-main-page-header-disabled vector-feature-page-tools-pinned-disabled vector-feature-toc-pinned-clientpref-1 vector-feature-main-menu-pinned-disabled vector-feature-limited-width-clientpref-1 vector-feature-limited-width-content-enabled vector-feature-custom-font-size-clientpref-1 vector-feature-appearance-pinned-clientpref-1 vector-sticky-header-enabled" lang="en" dir="ltr"><head>
<meta charset="UTF-8">
<title>JQuery Mobile</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="canonical" href="https://en.wikipedia.org/wiki/JQuery_Mobile"> <link href="./mw/ext.cite.styles.css" rel="stylesheet" type="text/css">
<link href="./mw/ext.pygments.css" rel="stylesheet" type="text/css">
<link href="./mw/skins.vector.icons.css" rel="stylesheet" type="text/css">
<link href="./mw/skins.vector.search.codex.styles.css" rel="stylesheet" type="text/css">
<link href="./mw/skins.vector.styles.css" rel="stylesheet" type="text/css">
<link href="./mw/user.styles.css" rel="stylesheet" type="text/css">
<meta name="ResourceLoaderDynamicStyles" content="">
<link rel="stylesheet" type="text/css" href="./mw/site.styles.css">
<link rel="stylesheet" type="text/css" href="./mw/noscript.css">
<link rel="stylesheet" type="text/css" href="./footer.css">
<link rel="stylesheet" type="text/css" href="./vector-2022.css">
</head>
<body class="skin--responsive skin-vector skin-vector-search-vue mediawiki ltr sitedir-ltr mw-hide-empty-elt ns-0 ns-subject page-JQuery_Mobile rootpage-JQuery_Mobile skin-vector-2022 action-view">
<div class="mw-page-container">
<div class="mw-page-container-inner">
<div class="mw-content-container">
<main id="content" class="mw-body">
<header class="mw-body-header vector-page-titlebar">
<h1 id="firstHeading" class="firstHeading mw-first-heading">
<span id="openzim-page-title" class="mw-page-title-main">jQuery Mobile</span>
</h1>
</header>
<a id="top"></a>
<div id="bodyContent" class="vector-body ve-init-mw-desktopArticleTarget-targetContainer" aria-labelledby="firstHeading" data-mw-ve-target-container="">
<div id="mw-content-text" class="mw-body-content mw-content-ltr" lang="en" dir="ltr"><div class="mw-content-ltr mw-parser-output" lang="en" dir="ltr">
<style data-mw-deduplicate="TemplateStyles:r1295905060">
/* start https://en.wikipedia.org/ */


.mw-parser-output .infobox-subbox{padding:0;border:none;margin:-3px;width:auto;min-width:100%;font-size:100%;clear:none;float:none;background-color:transparent}.mw-parser-output .infobox-3cols-child{margin:auto}.mw-parser-output .infobox .navbar{font-size:100%}@media screen{html.skin-theme-clientpref-night .mw-parser-output .infobox-full-data:not(.notheme)>div:not(.notheme)[style]{background:#1f1f23!important;color:#f8f9fa}}@media screen and (prefers-color-scheme:dark){html.skin-theme-clientpref-os .mw-parser-output .infobox-full-data:not(.notheme)>div:not(.notheme)[style]{background:#1f1f23!important;color:#f8f9fa}}@media(min-width:640px){body.skin--responsive .mw-parser-output .infobox-table{display:table!important}body.skin--responsive .mw-parser-output .infobox-table>caption{display:table-caption!important}body.skin--responsive .mw-parser-output .infobox-table>tbody{display:table-row-group}body.skin--responsive .mw-parser-output .infobox-table th,body.skin--responsive .mw-parser-output .infobox-table td{padding-left:inherit;padding-right:inherit}}


/* end https://en.wikipedia.org/ */
</style><table class="infobox vevent"><tbody><tr><th colspan="2" class="infobox-above summary">jQuery Mobile</th></tr><tr><td colspan="2" class="infobox-image logo"><span typeof="mw:File"></span></td></tr><tr><th scope="row" class="infobox-label" style="white-space: nowrap;"><a href="Programmer" title="Programmer">Developer(s)</a></th><td class="infobox-data"><a rel="nofollow" class="external text" href="https://jquery.org/team/">The jQuery Team</a></td></tr><tr><th scope="row" class="infobox-label" style="white-space: nowrap;">Initial release</th><td class="infobox-data">October&nbsp;16,&nbsp;2010<span style="display: none;">&nbsp;(<span class="bday dtstart published updated itvstart">2010-10-16</span>)</span><sup id="cite_ref-1" class="reference"><a href="#cite_note-1"><span class="cite-bracket">[</span>1<span class="cite-bracket">]</span></a></sup></td></tr><tr style="display: none;"><td colspan="2" class="infobox-full-data"></td></tr><tr><th scope="row" class="infobox-label" style="white-space: nowrap;"><a href="Software_release_life_cycle" title="Software release life cycle">Stable release</a></th><td class="infobox-data"><div style="margin:0px;">1.4.5
/ October&nbsp;31,&nbsp;2014<span style="display: none;">&nbsp;(<span class="bday dtstart published updated itvstart">2014-10-31</span>)</span></div></td></tr><tr><th scope="row" class="infobox-label" style="white-space: nowrap;"><a href="Software_release_life_cycle#Beta" title="Software release life cycle">Preview release</a></th><td class="infobox-data"><div style="margin:0px;">1.5.0-rc1
/ September&nbsp;10,&nbsp;2018<span style="display: none;">&nbsp;(<span class="bday dtstart published updated itvstart">2018-09-10</span>)</span></div></td></tr><tr style="display:none"><td colspan="2">
</td></tr><tr><th scope="row" class="infobox-label" style="white-space: nowrap;"><a href="Repository_(version_control)" title="Repository (version control)">Repository</a></th><td class="infobox-data"><style data-mw-deduplicate="TemplateStyles:r1126788409">
/* start https://en.wikipedia.org/ */


.mw-parser-output .plainlist ol,.mw-parser-output .plainlist ul{line-height:inherit;list-style:none;margin:0;padding:0}.mw-parser-output .plainlist ol li,.mw-parser-output .plainlist ul li{margin-bottom:0}


/* end https://en.wikipedia.org/ */
</style><div class="plainlist"><ul><li><span class="url"><a rel="nofollow" class="external text" href="https://github.com/jquery/jquery-mobile">github<wbr>.com<wbr>/jquery<wbr>/jquery-mobile</a></span> </li></ul>
</div></td></tr><tr><th scope="row" class="infobox-label" style="white-space: nowrap;">Written in</th><td class="infobox-data"><a href="JavaScript" title="JavaScript">JavaScript</a></td></tr><tr><th scope="row" class="infobox-label" style="white-space: nowrap;"><a href="Computing_platform" title="Computing platform">Platform</a></th><td class="infobox-data">See <a href="#Mobile_browser_support">Mobile browser support</a></td></tr><tr><th scope="row" class="infobox-label" style="white-space: nowrap;"><a href="File_size" title="File size">Size</a></th><td class="infobox-data">351&nbsp;KB / 142&nbsp;KB (minified) / 40&nbsp;KB (minified, gzipped)</td></tr><tr><th scope="row" class="infobox-label" style="white-space: nowrap;"><a href="Software_categories#Categorization_approaches" title="Software categories">Type</a></th><td class="infobox-data">Mobile application framework</td></tr><tr><th scope="row" class="infobox-label" style="white-space: nowrap;"><a href="Software_license" title="Software license">License</a></th><td class="infobox-data"><a href="MIT_License" title="MIT License">MIT</a><sup id="cite_ref-2" class="reference"><a href="#cite_note-2"><span class="cite-bracket">[</span>2<span class="cite-bracket">]</span></a></sup></td></tr><tr><th scope="row" class="infobox-label" style="white-space: nowrap;">Website</th><td class="infobox-data"><span class="url"><a rel="nofollow" class="external text" href="https://jquerymobile.com/">jquerymobile<wbr>.com</a></span></td></tr></tbody></table>
<p><b>jQuery Mobile</b> is a <a href="Touchscreen" title="Touchscreen">touch</a>-optimized <a href="Web_application_framework" class="mw-redirect" title="Web application framework">web framework</a> (also known as a mobile framework), specifically a <a href="JavaScript_library" title="JavaScript library">JavaScript library</a>, developed by the <a href="JQuery" title="JQuery">jQuery</a> project team. The development focuses on creating a framework <a href="Cross-browser" class="mw-redirect" title="Cross-browser">compatible</a> with many <a href="Smartphone" title="Smartphone">smartphones</a> and <a href="Tablet_computer" title="Tablet computer">tablet computers</a>,<sup id="cite_ref-supportable_3-0" class="reference"><a href="#cite_note-supportable-3"><span class="cite-bracket">[</span>3<span class="cite-bracket">]</span></a></sup> made necessary by the growing but heterogeneous tablet and smartphone market.<sup id="cite_ref-The_Global_Rise_of_the_Smartphone_4-0" class="reference"><a href="#cite_note-The_Global_Rise_of_the_Smartphone-4"><span class="cite-bracket">[</span>4<span class="cite-bracket">]</span></a></sup> The jQuery Mobile framework is consistent with other mobile app frameworks<sup id="cite_ref-5" class="reference"><a href="#cite_note-5"><span class="cite-bracket">[</span>5<span class="cite-bracket">]</span></a></sup> and platforms such as <a href="PhoneGap" class="mw-redirect" title="PhoneGap">PhoneGap</a>, Worklight,<sup id="cite_ref-6" class="reference"><a href="#cite_note-6"><span class="cite-bracket">[</span>6<span class="cite-bracket">]</span></a></sup> etc.
</p><p>As of October 7, 2021 jQuery Mobile has been deprecated.<sup id="cite_ref-7" class="reference"><a href="#cite_note-7"><span class="cite-bracket">[</span>7<span class="cite-bracket">]</span></a></sup>
</p>
<meta property="mw:PageProp/toc">
<div class="mw-heading mw-heading2"><h2 id="Features">Features</h2></div>
<ul><li>Compatible with all major desktop browsers as well as all major mobile platforms, including <a href="Android_(operating_system)" title="Android (operating system)">Android</a>, <a href="IOS" title="IOS">iOS</a>, <a href="Windows_Phone" title="Windows Phone">Windows Phone</a>, <a href="BlackBerry_OS" title="BlackBerry OS">Blackberry</a>, <a href="WebOS" title="WebOS">WebOS</a>, <a href="Symbian" title="Symbian">Symbian</a>.</li>
<li>Built on top of <a href="JQuery" title="JQuery">jQuery</a> core so it has a minimal learning curve for people already familiar with jQuery syntax.</li>
<li>Theming framework that allows creation of custom themes.</li>
<li>Limited dependencies and lightweight to optimize speed.</li>
<li>The same underlying codebase will automatically scale to any screen.</li>
<li>HTML5-driven configuration for laying out pages with minimal scripting.</li>
<li><a href="Ajax_(programming)" title="Ajax (programming)">AJAX</a>-powered navigation with animated page transitions that provides ability to create <a href="Semantic_URL" class="mw-redirect" title="Semantic URL">semantic URLs</a> through pushState.</li>
<li>UI widgets that are touch-optimized and platform-agnostic.</li></ul>
<p><i>(Source: from the jQuery Mobile website)</i><sup id="cite_ref-supportable_3-1" class="reference"><a href="#cite_note-supportable-3"><span class="cite-bracket">[</span>3<span class="cite-bracket">]</span></a></sup>
</p>
<div class="mw-heading mw-heading2"><h2 id="Example_usage">Example usage</h2></div>
<div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre><span class="nx">$</span><span class="p">(</span><span class="s1">'div'</span><span class="p">).</span><span class="nx">on</span><span class="p">(</span><span class="s1">'tap'</span><span class="p">,</span><span class="w"> </span><span class="kd">function</span><span class="p">(</span><span class="nx">event</span><span class="p">){</span>
<span class="w"> </span><span class="nx">alert</span><span class="p">(</span><span class="s1">'element tapped '</span><span class="p">);</span>
<span class="p">});</span>
</pre></div>
<div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre><span class="nx">$</span><span class="p">(</span><span class="nb">document</span><span class="p">).</span><span class="nx">ready</span><span class="p">(</span><span class="kd">function</span><span class="p">(){</span>
<span class="w"> </span><span class="nx">$</span><span class="p">(</span><span class="s1">'.myList li'</span><span class="p">).</span><span class="nx">on</span><span class="p">(</span><span class="s1">'click touchstart'</span><span class="p">,</span><span class="w"> </span><span class="kd">function</span><span class="p">()</span><span class="w"> </span><span class="p">{</span>
<span class="w"> </span><span class="nx">$</span><span class="p">(</span><span class="s1">'.myDiv'</span><span class="p">).</span><span class="nx">slideDown</span><span class="p">(</span><span class="s1">'500'</span><span class="p">);</span>
<span class="w"> </span><span class="p">});</span>
<span class="p">});</span>
</pre></div>
<div class="mw-heading mw-heading2"><h2 id="A_basic_example">A basic example</h2></div>
<p>What follows is a basic jQuery Mobile project utilizing <a href="HTML5#Markup" title="HTML5">HTML5 semantic elements</a>. It is important to link to the jQuery and jQuery Mobile JavaScript libraries, and stylesheet (the files can be downloaded and hosted locally, but it is recommended to link to the files hosted on the jQuery <a href="Content_delivery_network" title="Content delivery network">CDN</a>).
</p><p>A screen of the project is defined by a <code>section</code> HTML5 element, and <code>data-role</code> of <code>page</code>. Note that <code>data-role</code> is an example of the HTML5 <code>data</code> attribute, in this case being defined by jQuery Mobile. A page may have <code>header</code> and <code>footer</code> elements with <code>data-role</code> of <code>header</code> and <code>footer</code>, respectively. In between, there may be an <code>article</code> element, with a <code>role</code> of <code>main</code> and a <code>class</code> of <code>ui-content</code>. Lastly, a <code>nav</code> element, with <code>data-role</code> of <code>navbar</code> may be present.
</p><p>One HTML document can contain more than one <code>section</code> element, and thus <a href="Single-page_application" title="Single-page application">more than one screenful of content</a>. This way it is only necessary to load one file which includes multiple pages of content. One page can link to another page within the same file by referencing the page's id attribute (e.g. <code>href="#second"</code>).
</p><p>In the example below, two other data- attributes are used. The <code>data-theme</code> attribute tells the browser what theme to render. The <code>data-add-back-btn</code> attribute adds a back button to the page if set to <code>true</code>.
</p><p>Lastly, icons can be added to elements via the <code>data-icon</code> attribute. jQuery Mobile has fifty commonly used icons built in.
</p><p>A brief explanation of the Data Attributes used in this example:
</p><p><b>data-role</b> – Specifies the role of the element, such as header, content, footer, etc.
</p><p><b>data-theme</b> – Specifies which design theme to use for elements within a container. Can be set to: a or b.
</p><p><b>data-position</b> – Specifies whether the element should be fixed, in which case it will render at the top (for header) or bottom (for footer).
</p><p><b>data-transition</b> – Specifies one of ten built-in animations to use when loading new pages.
</p><p><b>data-icon</b> – Specifies one of fifty built-in icons that can be added to an element.
</p>
<div class="mw-highlight mw-highlight-lang-html mw-content-ltr" dir="ltr"><pre><span class="cp">&lt;!doctype html&gt;</span>
<span class="p">&lt;</span><span class="nt">html</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">head</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">meta</span> <span class="na">charset</span><span class="o">=</span><span class="s">"utf-8"</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">title</span><span class="p">&gt;</span>jQuery Mobile Example<span class="p">&lt;/</span><span class="nt">title</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">meta</span> <span class="na">name</span><span class="o">=</span><span class="s">"viewport"</span> <span class="na">content</span><span class="o">=</span><span class="s">"initial-scale=1, user-scalable=no, width=device-width"</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">link</span> <span class="na">rel</span><span class="o">=</span><span class="s">"stylesheet"</span> <span class="na">href</span><span class="o">=</span><span class="s">"https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css"</span><span class="p">&gt;</span>
<span class="p">&lt;/</span><span class="nt">head</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">body</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">section</span> <span class="na">data-role</span><span class="o">=</span><span class="s">"page"</span> <span class="na">id</span><span class="o">=</span><span class="s">"first"</span> <span class="na">data-theme</span><span class="o">=</span><span class="s">"a"</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">header</span> <span class="na">data-role</span><span class="o">=</span><span class="s">"header"</span> <span class="na">data-position</span><span class="o">=</span><span class="s">"fixed"</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">h1</span><span class="p">&gt;</span>Page 1 Header<span class="p">&lt;/</span><span class="nt">h1</span><span class="p">&gt;</span>
<span class="p">&lt;/</span><span class="nt">header</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">article</span> <span class="na">role</span><span class="o">=</span><span class="s">"main"</span> <span class="na">class</span><span class="o">=</span><span class="s">"ui-content"</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">h2</span><span class="p">&gt;</span>Hello, world!<span class="p">&lt;/</span><span class="nt">h2</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">a</span> <span class="na">href</span><span class="o">=</span><span class="s">"#second"</span> <span class="na">data-role</span><span class="o">=</span><span class="s">"button"</span> <span class="na">data-inline</span><span class="o">=</span><span class="s">"true"</span> <span class="na">data-transition</span><span class="o">=</span><span class="s">"flow"</span> <span class="na">data-icon</span><span class="o">=</span><span class="s">"carat-r"</span> <span class="na">data-iconpos</span><span class="o">=</span><span class="s">"right"</span><span class="p">&gt;</span>Go to Page 2<span class="p">&lt;/</span><span class="nt">a</span><span class="p">&gt;</span>
<span class="p">&lt;/</span><span class="nt">article</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">footer</span> <span class="na">data-role</span><span class="o">=</span><span class="s">"footer"</span> <span class="na">data-position</span><span class="o">=</span><span class="s">"fixed"</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">h4</span><span class="p">&gt;</span>Page 1 Footer<span class="p">&lt;/</span><span class="nt">h4</span><span class="p">&gt;</span>
<span class="p">&lt;/</span><span class="nt">footer</span><span class="p">&gt;</span>
<span class="p">&lt;/</span><span class="nt">section</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">section</span> <span class="na">data-role</span><span class="o">=</span><span class="s">"page"</span> <span class="na">id</span><span class="o">=</span><span class="s">"second"</span> <span class="na">data-theme</span><span class="o">=</span><span class="s">"b"</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">header</span> <span class="na">data-role</span><span class="o">=</span><span class="s">"header"</span> <span class="na">data-position</span><span class="o">=</span><span class="s">"fixed"</span> <span class="na">data-add-back-btn</span><span class="o">=</span><span class="s">"true"</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">h1</span><span class="p">&gt;</span>Page 2 Header<span class="p">&lt;/</span><span class="nt">h1</span><span class="p">&gt;</span>
<span class="p">&lt;/</span><span class="nt">header</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">article</span> <span class="na">role</span><span class="o">=</span><span class="s">"main"</span> <span class="na">class</span><span class="o">=</span><span class="s">"ui-content"</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">h2</span><span class="p">&gt;</span>Example Page<span class="p">&lt;/</span><span class="nt">h2</span><span class="p">&gt;</span>
<span class="p">&lt;/</span><span class="nt">article</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">footer</span> <span class="na">data-role</span><span class="o">=</span><span class="s">"footer"</span> <span class="na">data-position</span><span class="o">=</span><span class="s">"fixed"</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">h4</span><span class="p">&gt;</span>Page 2 Footer<span class="p">&lt;/</span><span class="nt">h4</span><span class="p">&gt;</span>
<span class="p">&lt;/</span><span class="nt">footer</span><span class="p">&gt;</span>
<span class="p">&lt;/</span><span class="nt">section</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://code.jquery.com/jquery-1.11.1.min.js"</span><span class="p">&gt;&lt;/</span><span class="nt">script</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"</span><span class="p">&gt;&lt;/</span><span class="nt">script</span><span class="p">&gt;</span>
<span class="p">&lt;/</span><span class="nt">body</span><span class="p">&gt;</span>
<span class="p">&lt;/</span><span class="nt">html</span><span class="p">&gt;</span>
</pre></div>
<div style="clear:both;" class=""></div>
<div class="mw-heading mw-heading2"><h2 id="Theming">Theming</h2></div>
<p>jQuery Mobile provides a theming framework that allows developers to customize color schemes and certain CSS aspects of UI features. Developers can use the jQuery Mobile ThemeRoller<sup id="cite_ref-ThemeRoller_8-0" class="reference"><a href="#cite_note-ThemeRoller-8"><span class="cite-bracket">[</span>8<span class="cite-bracket">]</span></a></sup> application to customize these appearances and create branded experiences. After developing a theme in the ThemeRoller application, programmers can download a custom CSS file and include it in their project to use their custom theme.<sup id="cite_ref-Theming_overview_9-0" class="reference"><a href="#cite_note-Theming_overview-9"><span class="cite-bracket">[</span>9<span class="cite-bracket">]</span></a></sup>
</p><p>Each theme can contain up to 26 unique color "swatches," each of which consists of a header bar, content body, and button states. Combining different swatches allows developers to create a wider range of visual effects than they would be able to with just one swatch per theme. Switching between different swatches within a theme is as simple as adding an attribute called "data-theme" to HTML elements.
</p><p>The default jQuery Mobile theme comes with two different color swatches, named "a" and "b". Here is an example of how to create a toolbar with the "b" swatch:
</p>
<div class="mw-highlight mw-highlight-lang-html mw-content-ltr" dir="ltr"><pre><span class="p">&lt;</span><span class="nt">div</span> <span class="na">data-role</span><span class="o">=</span><span class="s">"header"</span> <span class="na">data-theme</span><span class="o">=</span><span class="s">"b"</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">h1</span><span class="p">&gt;</span>Page Title<span class="p">&lt;/</span><span class="nt">h1</span><span class="p">&gt;</span>
<span class="p">&lt;/</span><span class="nt">div</span><span class="p">&gt;</span>
</pre></div>
<p><i>(Source: from the jQuery Mobile website)</i><sup id="cite_ref-supportable_3-2" class="reference"><a href="#cite_note-supportable-3"><span class="cite-bracket">[</span>3<span class="cite-bracket">]</span></a></sup>
</p><p>There are already a handful of open source style themes that are developed and supported by third-party organizations. One such open source style theme is the Metro style theme that was developed and released by Microsoft Open Technologies, Inc.<sup id="cite_ref-More_news_from_MS_Open_Tech:_announcing_the_open_source_Metro_style_theme_for_jQuery_Mobile_10-0" class="reference"><a href="#cite_note-More_news_from_MS_Open_Tech:_announcing_the_open_source_Metro_style_theme_for_jQuery_Mobile-10"><span class="cite-bracket">[</span>10<span class="cite-bracket">]</span></a></sup> The Metro style theme is meant to mimic the UI of the <a href="Metro_(design_language)" title="Metro (design language)">Metro (design language)</a> that Microsoft uses in its mobile operating systems.
</p>
<div class="mw-heading mw-heading2"><h2 id="Mobile_browser_support">Mobile browser support</h2></div>
<table class="wikitable sortable" style="table-layout: fixed; width: 105%; text-align: center">

<tbody><tr>
<th style="width:64pt;" rowspan="2">Platform
</th>
<th style="width:44pt;" rowspan="2">Version
</th>
<th style="width:35pt;" rowspan="2">Native
</th>
<th>Phone Gap
</th>
<th colspan="3"><a href="Opera_Mobile" title="Opera Mobile">Opera Mobile</a>
</th>
<th colspan="2"><a href="Opera_Mini" title="Opera Mini">Opera Mini</a>
</th>
<th colspan="2"><a href="Firefox_for_mobile" class="mw-redirect" title="Firefox for mobile">Fennec</a>
</th>
<th>Ozone
</th>
<th>Net front
</th></tr>
<tr>
<th>0.9
</th>
<th>8.5, 8.65
</th>
<th>9.5
</th>
<th>10
</th>
<th>4.0
</th>
<th>5.0
</th>
<th>1.0
</th>
<th>1.1*
</th>
<th>0.9
</th>
<th>4.0
</th></tr>
<tr>
<th rowspan="3"><a href="IOS" title="IOS">iOS</a>
</th>
<td>v2.2.1
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td></tr>
<tr>
<td>v3.1.3, v3.2
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td></tr>
<tr>
<td><b>v4-7.0</b>
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td></tr>
<tr>
<th rowspan="2"><a href="S60_(software_platform)" title="S60 (software platform)">Symbian S60</a>
</th>
<td>v3.1, v3.2
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td>
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td></tr>
<tr>
<td><b>v5.0</b>
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td>
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td></tr>
<tr>
<th rowspan="2"><a href="UIQ" title="UIQ">Symbian UIQ</a>
</th>
<td>v3.0, v3.1
</td>
<td>
</td>
<td>
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C <br><small>8.65</small>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td>
</td></tr>
<tr>
<td><b>v3.2</b>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td>
</td></tr>
<tr>
<th><a href="Symbian" title="Symbian">Symbian Platform</a>
</th>
<td>v.3.0
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td></tr>
<tr>
<th rowspan="4"><a href="BlackBerry_OS" title="BlackBerry OS">BlackBerry OS</a>
</th>
<td>v4.5
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td></tr>
<tr>
<td>v4.6, v4.7
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td style="background: #FFD; color:black; vertical-align: middle; text-align: center;" class="partial table-partial">B
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td></tr>
<tr>
<td><b>v5.0</b>
</td>
<td style="background: #FFD; color:black; vertical-align: middle; text-align: center;" class="partial table-partial">B
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td></tr>
<tr>
<td>v6.0
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td></tr>
<tr>
<th rowspan="3"><a href="Android_(operating_system)" title="Android (operating system)">Android</a>
</th>
<td>v1.5, v1.6
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td></tr>
<tr>
<td>v2.1
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td></tr>
<tr>
<td><b>v2.2</b>
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td>
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A*
</td>
<td>
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C*
</td>
<td>
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A*
</td>
<td>
</td></tr>
<tr>
<th rowspan="3"><a href="Windows_Mobile" title="Windows Mobile">Windows Mobile</a>
</th>
<td>v6.1
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td>
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td style="background: #FFD; color:black; vertical-align: middle; text-align: center;" class="partial table-partial">B
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td style="background: #FFD; color:black; vertical-align: middle; text-align: center;" class="partial table-partial">B
</td>
<td>
</td>
<td>
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td></tr>
<tr>
<td><b>v6.5.1</b>
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td>
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td>
</td>
<td>
</td></tr>
<tr>
<td>v7.0
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td></tr>
<tr>
<th><a href="WebOS" title="WebOS">webOS</a>
</th>
<td><b>1.4.1</b>
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td></tr>
<tr>
<th><a href="Bada_(operating_system)" title="Bada (operating system)">bada</a>
</th>
<td><b>1.0</b>
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td></tr>
<tr>
<th><a href="Maemo" title="Maemo">Maemo</a>
</th>
<td><b>5.0</b>
</td>
<td style="background: #FFD; color:black; vertical-align: middle; text-align: center;" class="partial table-partial">B
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td style="background: #FFD; color:black; vertical-align: middle; text-align: center;" class="partial table-partial">B
</td>
<td>
</td>
<td>
</td>
<td style="background:#FFC7C7;color:black;vertical-align:middle;text-align:center;" class="table-no">C
</td>
<td style="background: #FFD; color:black; vertical-align: middle; text-align: center;" class="partial table-partial">B*
</td>
<td>
</td>
<td>
</td></tr>
<tr>
<th><a href="MeeGo" title="MeeGo">MeeGo</a>
</th>
<td>1.1*
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A*
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A*
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td style="background: #BFD; color:black; vertical-align: middle; text-align: center;" class="yes2 table-yes2">A*
</td>
<td>
</td>
<td>
</td></tr></tbody></table>
<p><b>Key:</b>
</p>
<ul><li><b><span style="color: #00ff99;">A - High Quality.</span></b> A browser that’s capable of, at minimum, utilizing media queries (a requirement for jQuery Mobile). These browsers will be actively tested against, but may not receive the full capabilities of jQuery Mobile.</li>
<li><b><span style="color: #FF9B0A;">B - Medium Quality.</span></b> A capable browser that doesn’t have enough market share to warrant day-to-day testing. Bug fixes will still be applied to help these browsers.</li>
<li><b><span style="color: #D80700;">C - Low Quality.</span></b> A browser that is not capable of utilizing media queries. They will not be provided any jQuery Mobile scripting or CSS (falling back to plain HTML and simple CSS).</li>
<li>* - Upcoming browser. This browser is not yet released but is in alpha/beta testing.</li></ul>
<p><i>(Source: from the jQuery Mobile website)</i><sup id="cite_ref-supportable_3-3" class="reference"><a href="#cite_note-supportable-3"><span class="cite-bracket">[</span>3<span class="cite-bracket">]</span></a></sup>
</p>
<div class="mw-heading mw-heading2"><h2 id="See_also">See also</h2></div>
<style data-mw-deduplicate="TemplateStyles:r1266661725">
/* start https://en.wikipedia.org/ */


.mw-parser-output .portalbox{padding:0;margin:0.5em 0;display:table;box-sizing:border-box;max-width:175px;list-style:none}.mw-parser-output .portalborder{border:1px solid var(--border-color-base,#a2a9b1);padding:0.1em;background:var(--background-color-neutral-subtle,#f8f9fa)}.mw-parser-output .portalbox-entry{display:table-row;font-size:85%;line-height:110%;height:1.9em;font-style:italic;font-weight:bold}.mw-parser-output .portalbox-image{display:table-cell;padding:0.2em;vertical-align:middle;text-align:center}.mw-parser-output .portalbox-link{display:table-cell;padding:0.2em 0.2em 0.2em 0.3em;vertical-align:middle}@media(min-width:720px){.mw-parser-output .portalleft{margin:0.5em 1em 0.5em 0}.mw-parser-output .portalright{clear:right;float:right;margin:0.5em 0 0.5em 1em}}


/* end https://en.wikipedia.org/ */
</style>
<ul><li><a href="JQTouch" class="mw-redirect" title="JQTouch">jQTouch</a></li>
<li><a href="JQuery" title="JQuery">jQuery</a></li>
<li><a href="Content_adaptation" title="Content adaptation">Content adaptation</a></li>
<li><a href="DaVinci_(software)" title="DaVinci (software)">DaVinci Studio</a></li>
<li><a href="IUI_(software)" title="IUI (software)">iUI</a></li>
<li><a href="PhoneGap" class="mw-redirect" title="PhoneGap">PhoneGap</a></li>
<li><a href="Tizen" title="Tizen">Tizen</a></li>
<li><a href="ViziApps" title="ViziApps">ViziApps</a></li>
<li><a href="Bootstrap_(front-end_framework)" title="Bootstrap (front-end framework)">Bootstrap</a></li>
<li><a href="JavaScript_framework" class="mw-redirect" title="JavaScript framework">JavaScript framework</a></li>
<li><a href="JavaScript_library" title="JavaScript library">JavaScript library</a></li></ul>
<div class="mw-heading mw-heading2"><h2 id="References">References</h2></div>
<style data-mw-deduplicate="TemplateStyles:r1239543626">
/* start https://en.wikipedia.org/ */


.mw-parser-output .reflist{margin-bottom:0.5em;list-style-type:decimal}@media screen{.mw-parser-output .reflist{font-size:90%}}.mw-parser-output .reflist .references{font-size:100%;margin-bottom:0;list-style-type:inherit}.mw-parser-output .reflist-columns-2{column-width:30em}.mw-parser-output .reflist-columns-3{column-width:25em}.mw-parser-output .reflist-columns{margin-top:0.3em}.mw-parser-output .reflist-columns ol{margin-top:0}.mw-parser-output .reflist-columns li{page-break-inside:avoid;break-inside:avoid-column}.mw-parser-output .reflist-upper-alpha{list-style-type:upper-alpha}.mw-parser-output .reflist-upper-roman{list-style-type:upper-roman}.mw-parser-output .reflist-lower-alpha{list-style-type:lower-alpha}.mw-parser-output .reflist-lower-greek{list-style-type:lower-greek}.mw-parser-output .reflist-lower-roman{list-style-type:lower-roman}


/* end https://en.wikipedia.org/ */
</style><div class="reflist">
<div class="mw-references-wrap"><ol class="references">
<li id="cite_note-1"><span class="mw-cite-backlink"><b><a href="#cite_ref-1">^</a></b></span> <span class="reference-text"><style data-mw-deduplicate="TemplateStyles:r1238218222">
/* start https://en.wikipedia.org/ */


.mw-parser-output cite.citation{font-style:inherit;word-wrap:break-word}.mw-parser-output .citation q{quotes:"\"""\"""'""'"}.mw-parser-output .citation:target{background-color:rgba(0,127,255,0.133)}.mw-parser-output .id-lock-free.id-lock-free a{background:url("./mw/Lock-green.svg")right 0.1em center/9px no-repeat}.mw-parser-output .id-lock-limited.id-lock-limited a,.mw-parser-output .id-lock-registration.id-lock-registration a{background:url("./mw/Lock-gray-alt-2.svg")right 0.1em center/9px no-repeat}.mw-parser-output .id-lock-subscription.id-lock-subscription a{background:url("./mw/Lock-red-alt-2.svg")right 0.1em center/9px no-repeat}.mw-parser-output .cs1-ws-icon a{background:url("./mw/Wikisource-logo.svg")right 0.1em center/12px no-repeat}body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .id-lock-free a,body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .id-lock-limited a,body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .id-lock-registration a,body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .id-lock-subscription a,body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .cs1-ws-icon a{background-size:contain;padding:0 1em 0 0}.mw-parser-output .cs1-code{color:inherit;background:inherit;border:none;padding:inherit}.mw-parser-output .cs1-hidden-error{display:none;color:var(--color-error,#d33)}.mw-parser-output .cs1-visible-error{color:var(--color-error,#d33)}.mw-parser-output .cs1-maint{display:none;color:#085;margin-left:0.3em}.mw-parser-output .cs1-kern-left{padding-left:0.2em}.mw-parser-output .cs1-kern-right{padding-right:0.2em}.mw-parser-output .citation .mw-selflink{font-weight:inherit}@media screen{.mw-parser-output .cs1-format{font-size:95%}html.skin-theme-clientpref-night .mw-parser-output .cs1-maint{color:#18911f}}@media screen and (prefers-color-scheme:dark){html.skin-theme-clientpref-os .mw-parser-output .cs1-maint{color:#18911f}}


/* end https://en.wikipedia.org/ */
</style><cite id="CITEREFjQuery_Foundation_-_jquerymobile.com2010" class="citation web cs1">jQuery Foundation - jquerymobile.com (2010-10-16). <a rel="nofollow" class="external text" href="https://blog.jquerymobile.com/2010/10/16/jquery-mobile-alpha-1-released/">"jQuery Mobile Alpha 1 Released"</a>. blog.jquerymobile.com<span class="reference-accessdate">. Retrieved <span class="nowrap">2014-05-22</span></span>.</cite></span>
</li>
<li id="cite_note-2"><span class="mw-cite-backlink"><b><a href="#cite_ref-2">^</a></b></span> <span class="reference-text"><cite id="CITEREFjQuery_Foundation_-_jquery.org2012" class="citation web cs1">jQuery Foundation - jquery.org (2012-09-10). <a rel="nofollow" class="external text" href="https://blog.jquery.com/2012/09/10/jquery-licensing-changes/">"jQuery Licensing Changes"</a>. Blog.jquery.com<span class="reference-accessdate">. Retrieved <span class="nowrap">2013-10-09</span></span>.</cite></span>
</li>
<li id="cite_note-supportable-3"><span class="mw-cite-backlink">^ <a href="#cite_ref-supportable_3-0"><sup><i><b>a</b></i></sup></a> <a href="#cite_ref-supportable_3-1"><sup><i><b>b</b></i></sup></a> <a href="#cite_ref-supportable_3-2"><sup><i><b>c</b></i></sup></a> <a href="#cite_ref-supportable_3-3"><sup><i><b>d</b></i></sup></a></span> <span class="reference-text"><cite class="citation web cs1"><a rel="nofollow" class="external text" href="https://jquerymobile.com/gbs/">"Mobile Graded Browser Support"</a>.</cite></span>
</li>
<li id="cite_note-The_Global_Rise_of_the_Smartphone-4"><span class="mw-cite-backlink"><b><a href="#cite_ref-The_Global_Rise_of_the_Smartphone_4-0">^</a></b></span> <span class="reference-text"><cite class="citation web cs1"><a rel="nofollow" class="external text" href="https://web.archive.org/web/20180617042807/https://gigaom.com/2010/04/30/the-global-rise-of-the-smartphone/">"The Global Rise of the Smartphone"</a>. Archived from <a rel="nofollow" class="external text" href="http://gigaom.com/2010/04/30/the-global-rise-of-the-smartphone/">the original</a> on 2018-06-17<span class="reference-accessdate">. Retrieved <span class="nowrap">2011-04-27</span></span>.</cite></span>
</li>
<li id="cite_note-5"><span class="mw-cite-backlink"><b><a href="#cite_ref-5">^</a></b></span> <span class="reference-text"><cite class="citation web cs1"><a rel="nofollow" class="external text" href="http://www.htmlpanda.com/blog/why-jquery-mobile-is-suitable-for-mobile-web-app-development/">"Resons why jQuery Mobile Is Suitable For Mobile Web App Development"</a>.</cite></span>
</li>
<li id="cite_note-6"><span class="mw-cite-backlink"><b><a href="#cite_ref-6">^</a></b></span> <span class="reference-text"><cite class="citation web cs1"><a rel="nofollow" class="external text" href="http://www.worklight.com">"IBM Worklight - United States"</a>. Worklight.com<span class="reference-accessdate">. Retrieved <span class="nowrap">2013-10-09</span></span>.</cite></span>
</li>
<li id="cite_note-7"><span class="mw-cite-backlink"><b><a href="#cite_ref-7">^</a></b></span> <span class="reference-text"><cite class="citation web cs1"><a rel="nofollow" class="external text" href="https://blog.jquery.com/2021/10/07/jquery-maintainers-continue-modernization-initiative-with-deprecation-of-jquery-mobile//">"jQuery maintainers continue modernization initiative with deprecation of jQuery Mobile"</a>. jQuery Blog<span class="reference-accessdate">. Retrieved <span class="nowrap">6 December</span> 2022</span>.</cite></span>
</li>
<li id="cite_note-ThemeRoller-8"><span class="mw-cite-backlink"><b><a href="#cite_ref-ThemeRoller_8-0">^</a></b></span> <span class="reference-text"><cite class="citation web cs1"><a rel="nofollow" class="external text" href="https://jquerymobile.com/themeroller/">"ThemeRoller"</a>.</cite></span>
</li>
<li id="cite_note-Theming_overview-9"><span class="mw-cite-backlink"><b><a href="#cite_ref-Theming_overview_9-0">^</a></b></span> <span class="reference-text"><cite class="citation web cs1"><a rel="nofollow" class="external text" href="https://jquerymobile.com/test/docs/api/themes.html">"JQuery Mobile Theming Overview"</a>.</cite></span>
</li>
<li id="cite_note-More_news_from_MS_Open_Tech:_announcing_the_open_source_Metro_style_theme_for_jQuery_Mobile-10"><span class="mw-cite-backlink"><b><a href="#cite_ref-More_news_from_MS_Open_Tech:_announcing_the_open_source_Metro_style_theme_for_jQuery_Mobile_10-0">^</a></b></span> <span class="reference-text"><cite class="citation web cs1"><a rel="nofollow" class="external text" href="https://web.archive.org/web/20140816185609/http://blogs.msdn.com/b/interoperability/archive/2012/04/26/more-news-from-ms-open-tech-announcing-the-open-source-metro-style-theme.aspx">"More news from MS Open Tech: announcing the open source Metro style theme for jQuery Mobile"</a>. Archived from <a rel="nofollow" class="external text" href="http://blogs.msdn.com/b/interoperability/archive/2012/04/26/more-news-from-ms-open-tech-announcing-the-open-source-metro-style-theme.aspx">the original</a> on 2014-08-16.</cite></span>
</li>
</ol></div></div>
<div class="mw-heading mw-heading2"><h2 id="Further_reading">Further reading</h2></div>
<style data-mw-deduplicate="TemplateStyles:r1239549316">
/* start https://en.wikipedia.org/ */


.mw-parser-output .refbegin{margin-bottom:0.5em}.mw-parser-output .refbegin-hanging-indents>ul{margin-left:0}.mw-parser-output .refbegin-hanging-indents>ul>li{margin-left:0;padding-left:3.2em;text-indent:-3.2em}.mw-parser-output .refbegin-hanging-indents ul,.mw-parser-output .refbegin-hanging-indents ul li{list-style:none}@media(max-width:720px){.mw-parser-output .refbegin-hanging-indents>ul>li{padding-left:1.6em;text-indent:-1.6em}}.mw-parser-output .refbegin-columns{margin-top:0.3em}.mw-parser-output .refbegin-columns ul{margin-top:0}.mw-parser-output .refbegin-columns li{page-break-inside:avoid;break-inside:avoid-column}@media screen{.mw-parser-output .refbegin{font-size:90%}}


/* end https://en.wikipedia.org/ */
</style><div class="refbegin" style="">
<ul><li><cite id="CITEREFDoyle2014" class="citation book cs1">Doyle, Matt (March 18, 2014). <a rel="nofollow" class="external text" href="http://store.elated.com/"><i>Master Mobile Web Apps with jQuery Mobile</i></a> (4th&nbsp;ed.). Elated Books. p.&nbsp;567. <a href="ISBN_(identifier)" class="mw-redirect" title="ISBN (identifier)">ISBN</a>&nbsp;<bdi>978-0-9873115-3-5</bdi>.</cite></li>
<li><cite id="CITEREFPelletier2013" class="citation book cs1">Pelletier, Jeff (April 25, 2013). <a rel="nofollow" class="external text" href="http://mobileappmanual.com"><i>Mobile App Manual: The Blueprint</i></a> (1st&nbsp;ed.). Withinsight Publishing. p.&nbsp;96. <a href="ISBN_(identifier)" class="mw-redirect" title="ISBN (identifier)">ISBN</a>&nbsp;<bdi>978-0989072106</bdi>.</cite></li>
<li><cite id="CITEREFmann2011" class="citation book cs1">mann, Giulio (June 23, 2011). <a rel="nofollow" class="external text" href="http://www.packtpub.com/tagged-vivo_mobile-first-look/book"><i>jQuery Mobile First Look</i></a> (1st&nbsp;ed.). <a href="Packt_Publishing" class="mw-redirect" title="Packt Publishing">Packt Publishing</a>. p.&nbsp;216. <a href="ISBN_(identifier)" class="mw-redirect" title="ISBN (identifier)">ISBN</a>&nbsp;<bdi>1-84951-590-5</bdi>.</cite></li>
<li><cite id="CITEREFReid2011" class="citation book cs1">Reid, Jon (July 7, 2011). <a rel="nofollow" class="external text" href="https://archive.org/details/jquerymobile00reid_0/page/130"><i>jQuery Mobile</i></a> (1st&nbsp;ed.). <a href="O'Reilly_Media" title="O'Reilly Media">O'Reilly Media</a>. p.&nbsp;<a rel="nofollow" class="external text" href="https://archive.org/details/jquerymobile00reid_0/page/130">130</a>. <a href="ISBN_(identifier)" class="mw-redirect" title="ISBN (identifier)">ISBN</a>&nbsp;<bdi>1-4493-0668-3</bdi>.</cite></li>
<li><cite id="CITEREFDavid2011" class="citation book cs1">David, Matthew (September 21, 2011). <a rel="nofollow" class="external text" href="https://archive.org/details/html5mobilewebsi0000davi/page/250"><i>HTML5 Mobile Websites: Turbocharging HTML5 with jQuery Mobile, Sencha Touch, and Other Frameworks</i></a> (1st&nbsp;ed.). <a href="Focal_Press" title="Focal Press">Focal Press</a>. p.&nbsp;<a rel="nofollow" class="external text" href="https://archive.org/details/html5mobilewebsi0000davi/page/250">250</a>. <a href="ISBN_(identifier)" class="mw-redirect" title="ISBN (identifier)">ISBN</a>&nbsp;<bdi>0-240-81813-X</bdi>.</cite></li>
<li><cite id="CITEREFBroulik2011" class="citation book cs1">Broulik, Brad (November 30, 2011). <a rel="nofollow" class="external text" href="http://www.apress.com/mobile/ios/9781430239666"><i>Pro jQuery Mobile</i></a> (1st&nbsp;ed.). <a href="Apress" class="mw-redirect" title="Apress">Apress</a>. p.&nbsp;350. <a href="ISBN_(identifier)" class="mw-redirect" title="ISBN (identifier)">ISBN</a>&nbsp;<bdi>1-4302-3966-2</bdi>.</cite></li>
<li><cite id="CITEREFHolzner2012" class="citation book cs1">Holzner, Steven E. (January 2, 2012). <a rel="nofollow" class="external text" href="http://www.pearsonhighered.com/educator/product/Sams-Teach-Yourself-jQuery-Mobile-in-10-Minutes/9780672335570.page"><i>Sams Teach Yourself jQuery Mobile in 10 Minutes</i></a> (1st&nbsp;ed.). <a href="SAMS_Publishing" class="mw-redirect" title="SAMS Publishing">Sams</a>. p.&nbsp;240. <a href="ISBN_(identifier)" class="mw-redirect" title="ISBN (identifier)">ISBN</a>&nbsp;<bdi>0-672-33557-3</bdi>.</cite></li>
<li><cite id="CITEREFFirtman2012" class="citation book cs1">Firtman, Maximiliano (January 31, 2012). <a rel="nofollow" class="external text" href="http://shop.oreilly.com/product/0636920017.do"><i>jQuery Mobile: Up and Running</i></a> (1st&nbsp;ed.). <a href="O'Reilly_Media" title="O'Reilly Media">O'Reilly Media</a>. p.&nbsp;250. <a href="ISBN_(identifier)" class="mw-redirect" title="ISBN (identifier)">ISBN</a>&nbsp;<bdi>1-4493-9765-4</bdi>.</cite></li>
<li><cite id="CITEREFDuttson2012" class="citation book cs1">Duttson, Phill (July 13, 2012). <a rel="nofollow" class="external text" href="http://www.informit.com/title/0672335948"><i>Sams Teach Yourself jQuery Mobile in 24 Hours</i></a> (1st&nbsp;ed.). <a href="SAMS_Publishing" class="mw-redirect" title="SAMS Publishing">Sams</a>. p.&nbsp;475. <a href="ISBN_(identifier)" class="mw-redirect" title="ISBN (identifier)">ISBN</a>&nbsp;<bdi>0-672-33594-8</bdi>.</cite></li>
<li><cite id="CITEREFde_Jonge,_Adriaan2012" class="citation book cs1">de Jonge, Adriaan, Dutson, Phillip (November 2, 2012). <a rel="nofollow" class="external text" href="http://www.informit.com/title/0321822080"><i>jQuery, jQuery UI, and jQuery Mobile: Recipes and Examples</i></a> (1st&nbsp;ed.). <a href="Addison-Wesley_Professional" class="mw-redirect" title="Addison-Wesley Professional">Addison-Wesley Professional</a>. p.&nbsp;400. <a href="ISBN_(identifier)" class="mw-redirect" title="ISBN (identifier)">ISBN</a>&nbsp;<bdi>978-0-321-82208-6</bdi>.</cite><span class="cs1-maint citation-comment"><code class="cs1-code">{{cite book}}</code>: CS1 maint: multiple names: authors list (link)</span></li></ul>
</div>
<div class="mw-heading mw-heading2"><h2 id="External_links">External links</h2></div>
<ul><li><span class="official-website"><span class="url"><a rel="nofollow" class="external text" href="https://jquerymobile.com/">Official website</a></span></span></li>
<li><a rel="nofollow" class="external text" href="https://jquery.org/">The jQuery Project</a></li>
<li><a rel="nofollow" class="external text" href="https://demos.jquerymobile.com/1.0/">jQuery Mobile documentation and demo</a></li>
<li><a rel="nofollow" class="external text" href="https://web.archive.org/web/20120321094122/http://www.mobicules.com/html5/jquery-mobile-framework-write-less-do-more/">jQuery Mobile Framework: write less, do more</a></li>
<li><a rel="nofollow" class="external text" href="http://jquerymobile.codeplex.com/">jQuery Mobile C# ASP.NET By Matthew David Elgert</a> <a rel="nofollow" class="external text" href="https://web.archive.org/web/20140705135444/http://jquerymobile.codeplex.com/">Archived</a> 2014-07-05 at the <a href="Wayback_Machine" title="Wayback Machine">Wayback Machine</a></li>
<li><a rel="nofollow" class="external text" href="https://archive.today/20140228104452/http://propertycross.com/jquerymobile/">PropertyCross, Helping you select a cross-platform mobile framework: jQuery Mobile</a></li></ul>
<div class="navbox-styles"><style data-mw-deduplicate="TemplateStyles:r1129693374">
/* start https://en.wikipedia.org/ */


.mw-parser-output .hlist dl,.mw-parser-output .hlist ol,.mw-parser-output .hlist ul{margin:0;padding:0}.mw-parser-output .hlist dd,.mw-parser-output .hlist dt,.mw-parser-output .hlist li{margin:0;display:inline}.mw-parser-output .hlist.inline,.mw-parser-output .hlist.inline dl,.mw-parser-output .hlist.inline ol,.mw-parser-output .hlist.inline ul,.mw-parser-output .hlist dl dl,.mw-parser-output .hlist dl ol,.mw-parser-output .hlist dl ul,.mw-parser-output .hlist ol dl,.mw-parser-output .hlist ol ol,.mw-parser-output .hlist ol ul,.mw-parser-output .hlist ul dl,.mw-parser-output .hlist ul ol,.mw-parser-output .hlist ul ul{display:inline}.mw-parser-output .hlist .mw-empty-li{display:none}.mw-parser-output .hlist dt::after{content:": "}.mw-parser-output .hlist dd::after,.mw-parser-output .hlist li::after{content:" · ";font-weight:bold}.mw-parser-output .hlist dd:last-child::after,.mw-parser-output .hlist dt:last-child::after,.mw-parser-output .hlist li:last-child::after{content:none}.mw-parser-output .hlist dd dd:first-child::before,.mw-parser-output .hlist dd dt:first-child::before,.mw-parser-output .hlist dd li:first-child::before,.mw-parser-output .hlist dt dd:first-child::before,.mw-parser-output .hlist dt dt:first-child::before,.mw-parser-output .hlist dt li:first-child::before,.mw-parser-output .hlist li dd:first-child::before,.mw-parser-output .hlist li dt:first-child::before,.mw-parser-output .hlist li li:first-child::before{content:" (";font-weight:normal}.mw-parser-output .hlist dd dd:last-child::after,.mw-parser-output .hlist dd dt:last-child::after,.mw-parser-output .hlist dd li:last-child::after,.mw-parser-output .hlist dt dd:last-child::after,.mw-parser-output .hlist dt dt:last-child::after,.mw-parser-output .hlist dt li:last-child::after,.mw-parser-output .hlist li dd:last-child::after,.mw-parser-output .hlist li dt:last-child::after,.mw-parser-output .hlist li li:last-child::after{content:")";font-weight:normal}.mw-parser-output .hlist ol{counter-reset:listitem}.mw-parser-output .hlist ol>li{counter-increment:listitem}.mw-parser-output .hlist ol>li::before{content:" "counter(listitem)"\a0 "}.mw-parser-output .hlist dd ol>li:first-child::before,.mw-parser-output .hlist dt ol>li:first-child::before,.mw-parser-output .hlist li ol>li:first-child::before{content:" ("counter(listitem)"\a0 "}


/* end https://en.wikipedia.org/ */
</style><style data-mw-deduplicate="TemplateStyles:r1236075235">
/* start https://en.wikipedia.org/ */


.mw-parser-output .navbox{box-sizing:border-box;border:1px solid #a2a9b1;width:100%;clear:both;font-size:88%;text-align:center;padding:1px;margin:1em auto 0}.mw-parser-output .navbox .navbox{margin-top:0}.mw-parser-output .navbox+.navbox,.mw-parser-output .navbox+.navbox-styles+.navbox{margin-top:-1px}.mw-parser-output .navbox-inner,.mw-parser-output .navbox-subgroup{width:100%}.mw-parser-output .navbox-group,.mw-parser-output .navbox-title,.mw-parser-output .navbox-abovebelow{padding:0.25em 1em;line-height:1.5em;text-align:center}.mw-parser-output .navbox-group{white-space:nowrap;text-align:right}.mw-parser-output .navbox,.mw-parser-output .navbox-subgroup{background-color:#fdfdfd}.mw-parser-output .navbox-list{line-height:1.5em;border-color:#fdfdfd}.mw-parser-output .navbox-list-with-group{text-align:left;border-left-width:2px;border-left-style:solid}.mw-parser-output tr+tr>.navbox-abovebelow,.mw-parser-output tr+tr>.navbox-group,.mw-parser-output tr+tr>.navbox-image,.mw-parser-output tr+tr>.navbox-list{border-top:2px solid #fdfdfd}.mw-parser-output .navbox-title{background-color:#ccf}.mw-parser-output .navbox-abovebelow,.mw-parser-output .navbox-group,.mw-parser-output .navbox-subgroup .navbox-title{background-color:#ddf}.mw-parser-output .navbox-subgroup .navbox-group,.mw-parser-output .navbox-subgroup .navbox-abovebelow{background-color:#e6e6ff}.mw-parser-output .navbox-even{background-color:#f7f7f7}.mw-parser-output .navbox-odd{background-color:transparent}.mw-parser-output .navbox .hlist td dl,.mw-parser-output .navbox .hlist td ol,.mw-parser-output .navbox .hlist td ul,.mw-parser-output .navbox td.hlist dl,.mw-parser-output .navbox td.hlist ol,.mw-parser-output .navbox td.hlist ul{padding:0.125em 0}.mw-parser-output .navbox .navbar{display:block;font-size:100%}.mw-parser-output .navbox-title .navbar{float:left;text-align:left;margin-right:0.5em}body.skin--responsive .mw-parser-output .navbox-image img{max-width:none!important}@media print{body.ns-0 .mw-parser-output .navbox{display:none!important}}


/* end https://en.wikipedia.org/ */
</style><style data-mw-deduplicate="TemplateStyles:r1038841319">
/* start https://en.wikipedia.org/ */


.mw-parser-output .tooltip-dotted{border-bottom:1px dotted;cursor:help}


/* end https://en.wikipedia.org/ */
</style></div><div role="navigation" class="navbox authority-control" aria-label="Navbox600" style="padding:3px"><table class="nowraplinks hlist navbox-inner" style="border-spacing:0;background:transparent;color:inherit"><tbody><tr><th scope="row" class="navbox-group" style="width:1%">Authority control databases: National </th><td class="navbox-list-with-group navbox-list navbox-odd" style="width:100%;padding:0"><div style="padding:0 0.25em"><ul><li><span class="uid"><span class="rt-commentedText tooltip tooltip-dotted" title="jQuery Mobile (knihovna-software)"><a rel="nofollow" class="external text" href="https://aleph.nkp.cz/F/?func=find-c&amp;local_base=aut&amp;ccl_term=ica=ph761570&amp;CON_LNG=ENG">Czech Republic</a></span></span></li></ul></div></td></tr></tbody></table></div></div><!--htdig_noindex--><div><div class="zim-footer">
This article is issued from <a class="external text" title="Last edited on 2025-06-22" href="https://en.wikipedia.org/wiki/?title=JQuery_Mobile&amp;oldid=1296768787">Wikipedia</a>. The text is available under <a class="external text" href="https://creativecommons.org/licenses/by-sa/4.0/deed.en">Creative Commons Attribution-Share Alike 4.0</a> unless otherwise noted. Additional terms may apply for the media files.
</div>
</div><!--/htdig_noindex--></div>
</div>
</main>
</div>
</div>
</div>

</body></html>